<template>
	<view>
		
		<block v-for="(item, index) in data" :key="index">
		<view class="content_box" @click="gotopage11(item.consigner,item.phone,item.city+' '+item.detail,item.address_id)">
		  <view class="content">
		    <view class="icon_box">
		      <view class="icon iconfont">&#xe622;</view>
		    </view>
		    <view class="address">
		      <view class="name_box">
		    <view class="name">{{item.consigner}}</view>
		    <view class="phone">{{item.phone}}</view>
		      </view>
		     <view class="ar">{{item.city}}{{item.detail}}</view>
		    </view>
		  </view>
		  <view class="menu_box">
		    <view class="tick_box" :data-index="index" @tap="autoTick">
		      <view class="tick iconfont" :class="item.isdef? 'tickcolor' : ''">&#xe61f;</view>
		      <view class="text" :class="item.isdef? 'ticktext' : ''">默认地址</view>
		    </view>
		    <view class="menu">
		      <view class="m" :data-url="'/pages/address/addaddress?id='+item.address_id" @click="gotopage">
		        <view class="icon iconfont">&#xe604;</view>
		        <view class="text">编辑</view>
		      </view>
		       <view class="m" @click="del(item.address_id)">
		        <view class="icon iconfont">&#xe657;</view>
		        <view class="text">删除</view>
		      </view>
		      
		    </view>
		  </view>
		</view>
		
		</block>
				<button class="confirm" data-url="/pages/address/addaddress" @click="gotopage">添加地址</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			data:'',
			f:0,
			l:'',
			addressdata: [
			      {
			        name:'程笑笑',
			        phone:'158847224554',
			        address:'福建省福州市晋安区福光路162号福建省福州市晋安区福光路162号福',
			        tick:false,
			      },
			      {
			        name: '程笑笑',
			        phone: '158847224554',
			        address: '福建省福州市晋安区福光路162号福建省福州市晋安区福光路162号福',
			        tick: false,
			      },
			      {
			        name: '程笑笑',
			        phone: '158847224554',
			        address: '福建省福州市晋安区福光路162号福建省福州市晋安区福光路162号福',
			        tick: false,
			      },
			    ],
		};
	},
	onLoad(e){
			this.lod()
			let me = this;
			console.log(e)
			me.f=e.f
		},	
		onShow(e){
				this.lod()
				
			},	
	methods: {
		lod()
		{
			let me = this;
		
			
					
			me.Net._get('address',{},(res)=>{
				if(res.code ==1){
					me.data=res.data
				  console.log(me.data)
				}
			});	
		},
		del(id) {
			let me = this;
			uni.showModal({
				content: '确定删除？',
				success: (res) => {
					if (res.confirm) {
						
						me.Net._get('addressDel',{id:id},(res)=>{
							if(res.code ==1){
								me.lod()
							}
						});		
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}
			});
		},
		autoTick: function (e) {
		    var this_ = this;
		    let index = e.currentTarget.dataset.index;
		    let addressdata = this_.data;
		   
		    addressdata.forEach(item => {
		      item.isdef = 0;
		
		    })
		   
		    addressdata[index].isdef = 1;
			this_.Net._get('addressdef',{id:addressdata[index].address_id},(res)=>{
				if(res.code ==1){
				
				}
			});	
		  },
		gotopage11(a,b,c,d){
			if(!this.f)return
		    uni.setStorageSync('a',a)
			uni.setStorageSync('b',b)
			uni.setStorageSync('c',c)
			uni.setStorageSync('d',d)
			uni.navigateBack({
				
			})
			
		},
		  gotopage(e){
		  	let url = e.currentTarget.dataset.url;
		  	uni.navigateTo({
		  		url:url
		  	})
		  }
	}
};
</script>

<style>
	
	page{
		background-color: #f8f8f8;
	}
	
	.content_box {
	  width: 92%;
	  margin-left: 4%;
	  margin-top: 10px;
	  display: inline-block;
	  background-color: #fff;
	  border-radius: 6px;
		box-sizing: border-box;
		padding: 15rpx 0;
	}
	
	.content {
	  width: 100%;
	  display: flex;
	}
	
	.content .icon_box {
	  width: 54px;
	  height: 54px;
	  position: relative;
	}
	
	.content .icon_box .icon {
	  width: 34px;
	  height: 34px;
	  border-radius: 50%;
	  position: absolute;
	  left: calc(50% - 17px);
	  top: calc(50% - 17px);
	  line-height: 34px;
	  text-align: center;
	  color: #666;
	  font-size: 28px;
	  
	}
	
	.content .address {
	  width: calc(100% - 54px);
	}
	
	.content .address .name_box {
	  width: 100%;
	  height: 30px;
	  display: flex;
	}
	
	.content .address .name_box .name {
	  font-size: 17px;
	  color: #333;
	  line-height: 30px;
	  margin-right: 10px;
	}
	
	.content .address .name_box .phone {
	  font-size: 16px;
	  color: #999;
	  line-height: 30px;
	}
	
	.content .address .ar {
	  font-size: 17px;
	  color: #333;
	  line-height: 20px;
	  padding-right: 10px;
	}
	
	.content_box .menu_box {
	  width: 100%;
	  height: 40px;
	  position: relative;
	}
	
	.content_box .menu_box .tick_box {
	  display: flex;
	  position: absolute;
	  left: 0;
	  height: 40px;
	}
	
	.content_box .menu_box .tick {
	  width: 18px;
	  height: 18px;
	  border-radius: 50%;
	  margin: 12px 10px 0 10px;
	  font-size: 20px;
	  line-height: 18px;
	  color: #999;
	  text-align: center;
	  background-color: #fff;
	}
	
	.content_box .menu_box .text {
	  font-size: 15px;
	  line-height: 40px;
	  color: #a9a9a9;
	}
	
	.content_box .menu_box .menu {
	  display: flex;
	  position: absolute;
	  right: 0;
	  height: 40px;
	}
	
	.content_box .menu_box .menu .m {
	  display: flex;
	  height: 40px;
	}
	
	.content_box .menu_box .menu .m:nth-child(1) {
	  margin-right: 20px;
	}
	.content_box .menu_box .menu .m:nth-child(2) {
	  margin-right: 10px;
	}
	
	.content_box .menu_box .menu .m .icon {
	  font-size: 16px;
	  color: #a9a9a9;
	  line-height: 40px;
	  margin-right: 10px;
	}
	
	.content_box .menu_box .menu .m .text {
	  font-size: 17px;
	  color: #a9a9a9;
	  line-height: 40px;
	}
	
	.tickcolor {
	  color: #4d726f !important;
	}
	
	.ticktext {
	  color: #4d726f !important;
	}
	
</style>
